<!-- 右下角悬浮窗 -->
<div class="floating-window" id="floatingWindow">
    <span class="close" onclick="toggleFloatingWindow()">&times;</span>
    <h4>联系我们</h4>
    <p>邮箱：spf@zirice.com</p>
    <img src="{{ App\Helpers\FunTool::imageUrl(config("company.contact_us"))}}" alt="">
    <p style="margin-top: 20px">扫描二维码添加官方客服</p>
</div>
<div class="open-window" onclick="toggleFloatingWindow()">
    <i class="fa feather icon-message-circle" style="font-size: 36px"></i>
{{--    <span class=" " onclick="this.parentElement.style.display='none'">&times;</span>--}}
</div>
<style>
    .floating-window {
        position: fixed;
        bottom: 20px;
        right: 20px;
        /*width: 220px;*/
        background: #fff;
        border: 1px solid #ddd;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
        border-radius: 5px;
        z-index: 9999;
        padding: 50px;
    }
    .open-window{
        position: fixed;
        bottom: 60px;
        right: 20px;
        z-index: 9998;
        background: #fff;
        border: 1px solid #ddd;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
        border-radius: 15px;
        padding: 10px;
    }
    .floating-window .close {
        position: absolute;
        top: 10px;
        right: 10px;
        cursor: pointer;

    }
</style>

<script>
    function toggleFloatingWindow() {
        var floatingWindow = document.getElementById('floatingWindow');
        if (floatingWindow.style.display === 'none' || floatingWindow.style.display === '') {
            floatingWindow.style.display = 'block';
        } else {
            floatingWindow.style.display = 'none';
        }
    }
</script>